<template>
	<div>
		<van-swipe :autoplay="3000">
		  <van-swipe-item v-for="(image, index) in images" :key="index">
		    <van-image :src="url+image.image_url" :lazy-load="true" width="55%" height="100%"></van-image>
		  </van-swipe-item>
		</van-swipe>
		<van-row style="width: 100vw;height: 10vh;">
			<van-col span="16" style="text-align: left;color: red;font-weight: bolder;line-height: 10vh;font-size: 18px;padding-left: 5px;">
				￥{{lists.shop_price}}
			</van-col>
			<van-col span="4" style="height: 10vh;">
				<van-row style="width: 100%;height: 5vh;">
					<van-col span="24">
						<van-icon name="share-o" style="margin-top: 15px;"/>
					</van-col>
				</van-row>
				<van-row style="width: 100%;height: 5vh;">
					<van-col span="24" style="font-size: 12px;line-height: 5vh;">
						降价通知
					</van-col>
				</van-row>
			</van-col>
			<van-col span="4" style="height: 10vh;">
				<van-row style="width: 100%;height: 5vh;">
					<van-col span="24">
						<van-icon name="star-o" style="margin-top: 15px;" @click="collact"/>
					</van-col>
				</van-row>
				<van-row style="width: 100%;height: 5vh;">
					<van-col span="24" style="font-size: 12px;line-height: 5vh;">
						收藏有礼
					</van-col>
				</van-row>
			</van-col>
		</van-row>
		<van-row style="width: 100vw;height: 9vh;">
			<van-col span="24" style="padding-left: 5px;padding-right: 5px;font-size: 15px;font-weight: bolder;text-align: left;">
				{{lists.goods_name}}
			</van-col>
		</van-row>
		<van-row style="width: 100vw;height: 5vh;">
			<van-col span="24" style="padding-left: 5px;padding-right: 5px;font-size: 12px;text-align: left;line-height: 5vh;">
				懂哦就能吃到农村是哦那哦那传送
			</van-col>
		</van-row>
		<van-row style="width: 100vw;height: 5vh;">
			<van-col span="21" style="padding-left: 5px;padding-right: 5px;font-size: 12px;text-align: left;line-height: 5vh;color: #ccc;">
				懂哦就能吃到
			</van-col>
			<van-col span="3" style="padding-left: 5px;padding-right: 5px;font-size: 12px;text-align: left;line-height: 5vh;color: #ccc;">
				懂哦
			</van-col>
		</van-row>
		<van-row style="width: 100vw;height: 5vh;">
			<van-col span="24" style="padding-left: 5px;padding-right: 5px;font-size: 12px;text-align: left;">
				懂哦就能吃到农村是哦那哦那传送懂哦就能吃到农村是哦那哦那传送懂哦就能吃到农村是哦那哦那传送懂哦就能吃到农村是哦那哦那传送懂哦就能吃到农村是哦那哦那传送
			</van-col>
		</van-row>
	</div>
</template>

<script>
	
	export default {
		props:{
			images:{
				type:Array
			},
			lists:{
				default:()=>[]
			}
		},
	  data() {
	    return {
			url:'https://img.9lele.com'
	      
	    };
	  },
	  methods:{
		  collact() {
		  				// this.pitch = false
		  				let img = this.lists.original_img
		  				let name = this.lists.goods_name
		  				let price = this.lists.shop_price
		  				let json = {
		  					img: img,
		  					name: name,
		  					price: price
		  				}
		  				console.log(JSON.parse(localStorage.getItem('collect')), '收藏')
		  				let collect = JSON.parse(localStorage.getItem('collect'))
		  				if (collect == null) {
		  					localStorage.setItem('collect', JSON.stringify(json))
		  				} else {
		  					let a = [
		  						JSON.parse(localStorage.getItem('collect'))
		  					]
		  					console.log(a,'000')
		  					a.push(json)
		  					localStorage.setItem('collect', JSON.stringify(a))
		  				}
		  			}
	  }
	};
</script>

<style>
	.van-swipe .van-swipe-item {
		height: 200px;
	    color: #fff;
	    font-size: 20px;
	    line-height: 200px;
	    text-align: center;
	    background-color: #fff;
	  }
</style>
